<!--[pnpageaddvar name="stylesheet" value="modules/HotelBooking/pnincludes/plupload/js/jquery.plupload.queue/css/jquery.plupload.queue.css"]-->

<!--[pnpageaddvar name="javascript" value="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"]-->
<!--[pnpageaddvar name="javascript" value="http://bp.yahooapis.com/2.4.21/browserplus-min.js"]-->

<!--[pnpageaddvar name="javascript" value="modules/HotelBooking/pnincludes/plupload/js/plupload.js"]-->
<!--[pnpageaddvar name="javascript" value="modules/HotelBooking/pnincludes/plupload/js/plupload.gears.js"]-->
<!--[pnpageaddvar name="javascript" value="modules/HotelBooking/pnincludes/plupload/js/plupload.silverlight.js"]-->
<!--[pnpageaddvar name="javascript" value="modules/HotelBooking/pnincludes/plupload/js/plupload.flash.js"]-->
<!--[pnpageaddvar name="javascript" value="modules/HotelBooking/pnincludes/plupload/js/plupload.browserplus.js"]-->
<!--[pnpageaddvar name="javascript" value="modules/HotelBooking/pnincludes/plupload/js/plupload.html4.js"]-->
<!--[pnpageaddvar name="javascript" value="modules/HotelBooking/pnincludes/plupload/js/plupload.html5.js"]-->
<!--[pnpageaddvar name="javascript" value="modules/HotelBooking/pnincludes/plupload/js/jquery.plupload.queue/jquery.plupload.queue.js"]-->
	<h1>Queue widget example</h1>
<form method="post" action="<!--[pnmodurl modname='HotelBooking' func='list' ctrl='hotelimages' hotelid=$smarty.get.hotelid]-->">
	<div style="float: left; margin-right: 20px; width: 100%;">
		<h3>HTML 5 runtime</h3>
		<div id="html5_uploader" style="width: 100%; height: 330px;">You browser doesn't support native upload. Try Firefox 3 or Safari 4.		</div>
	</div>
	<br style="clear: both" />
	<input type="submit" value=" Upload Files ">
	</form>
	<br style="clear: both" />

<script type="text/javascript">
$(function() {
	
	// Setup html5 version
	$("#html5_uploader").pluploadQueue({
		// General settings
		runtimes : 'gears,html5,flash,silverlight,browserplus',
		url : 'index.php?module=HotelBooking&func=fileupload&hotelid=<!--[$smarty.get.hotelid]-->',
		max_file_size : '10mb',
		chunk_size : '1mb',
		unique_names : true,
		filters : [
			{title : "Image files", extensions : "jpg,gif,png"}
		],

		// Resize images on clientside if we can
		//resize : {width : 320, height : 240, quality : 90}
	});
	
	// Client side form validation
	$('form').submit(function(e) {
        var uploader = $('#html5_uploader').pluploadQueue();

        // Files in queue upload them first
        if (uploader.files.length > 0) {
            // When all files are uploaded submit form
            uploader.bind('StateChanged', function() {
                if (uploader.files.length === (uploader.total.uploaded + uploader.total.failed)) {
                    $('form')[0].submit();
                }
            });
                
            uploader.start();
        } else {
            alert('You must queue at least one file.');
        }

        return false;
    });
});

</script>